/**
 * jquery.plupload.queue.js
 *
 * Copyright 2009, Moxiecode Systems AB
 * Released under GPL License.
 *
 * License: http://www.plupload.com/license
 * Contributing: http://www.plupload.com/contributing
 */

/* global jQuery:true, alert:true */

/**
jQuery based implementation of the Plupload API - multi-runtime file uploading API.

To use the widget you must include _jQuery_. It is not meant to be extended in any way and is provided to be
used as it is.

@example
	<!-- Instantiating: -->
	<div id="uploader">
		<p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
	</div>

	<script>
		$('#uploader').pluploadQueue({
			url : '../upload.php',
			filters : [
				{title : "Image files", extensions : "jpg,gif,png"}
			],
			rename: true,
			flash_swf_url : '../../js/Moxie.swf',
			silverlight_xap_url : '../../js/Moxie.xap',
		});
	</script>

@example
	// Retrieving a reference to plupload.Uploader object
	var uploader = $('#uploader').pluploadQueue();

	uploader.bind('FilesAdded', function() {
		
		// Autostart
		setTimeout(uploader.start, 1); // "detach" from the main thread
	});

@class pluploadQueue
@constructor
@param {Object} settings For detailed information about each option check documentation.
	@param {String} settings.url URL of the server-side upload handler.
	@param {Number|String} [settings.chunk_size=0] Chunk size in bytes to slice the file into. Shorcuts with b, kb, mb, gb, tb suffixes also supported. `e.g. 204800 or "204800b" or "200kb"`. By default - disabled.
	@param {String} [settings.file_data_name="file"] Name for the file field in Multipart formated message.
	@param {Array} [settings.filters=[]] Set of file type filters, each one defined by hash of title and extensions. `e.g. {title : "Image files", extensions : "jpg,jpeg,gif,png"}`. Dispatches `plupload.FILE_EXTENSION_ERROR`
	@param {String} [settings.flash_swf_url] URL of the Flash swf.
	@param {Object} [settings.headers] Custom headers to send with the upload. Hash of name/value pairs.
	@param {Number|String} [settings.max_file_size] Maximum file size that the user can pick, in bytes. Optionally supports b, kb, mb, gb, tb suffixes. `e.g. "10mb" or "1gb"`. By default - not set. Dispatches `plupload.FILE_SIZE_ERROR`.
	@param {Number} [settings.max_retries=0] How many times to retry the chunk or file, before triggering Error event.
	@param {Boolean} [settings.multipart=true] Whether to send file and additional parameters as Multipart formated message.
	@param {Object} [settings.multipart_params] Hash of key/value pairs to send with every file upload.
	@param {Boolean} [settings.multi_selection=true] Enable ability to select multiple files at once in file dialog.
	@param {Boolean} [settings.prevent_duplicates=false] Do not let duplicates into the queue. Dispatches `plupload.FILE_DUPLICATE_ERROR`.
	@param {String|Object} [settings.required_features] Either comma-separated list or hash of required features that chosen runtime should absolutely possess.
	@param {Object} [settings.resize] Enable resizng of images on client-side. Applies to `image/jpeg` and `image/png` only. `e.g. {width : 200, height : 200, quality : 90, crop: true}`
		@param {Number} [settings.resize.width] If image is bigger, it will be resized.
		@param {Number} [settings.resize.height] If image is bigger, it will be resized.
		@param {Number} [settings.resize.quality=90] Compression quality for jpegs (1-100).
		@param {Boolean} [settings.resize.crop=false] Whether to crop images to exact dimensions. By default they will be resized proportionally.
	@param {String} [settings.runtimes="html5,flash,silverlight,html4"] Comma separated list of runtimes, that Plupload will try in turn, moving to the next if previous fails.
	@param {String} [settings.silverlight_xap_url] URL of the Silverlight xap.
	@param {Boolean} [settings.unique_names=false] If true will generate unique filenames for uploaded files.

	@param {Boolean} [settings.dragdrop=true] Enable ability to add file to the queue by drag'n'dropping them from the desktop.
	@param {Boolean} [settings.rename=false] Enable ability to rename files in the queue.
	@param {Boolean} [settings.multiple_queues=true] Re-activate the widget after each upload procedure.
*/
; (function ($, o) {
    var uploaders = {};

    function _(str) {
        return plupload.translate(str) || str;
    }

    function renderUI(id, target) {
        // Remove all existing non plupload items
        target.contents().each(function (i, node) {
            node = $(node);

            if (!node.is('.plupload')) {
                node.remove();
            }
        });
        //

        target.append(
        	$('<div class="publish_section">' +
            	'<div class="publish_tit">' +
                	'<h3>笔记章节</h3>' +
                    '<div class="publish_tit_but_box">' +
                        '<a href="javascript:;" class="publish_tit_but_1"></a><a href="javascript:;" class="publish_tit_but_3"></a>' +
                        '</a>' +
                        '' +
                    '</div>' +
                '</div>' +
            	'<div class="publish_input_box">' +
                	'<div class="publish_input_name"><span>*</span>章节名称</div>' +
                    '<div class="publish_inputs">' +
                        '<div class="publish_input"><input type="text" placeholder="章节名称" /></div>' +
                        '<div class="publish_error publish_error_1" style="display:none"><span></span><strong>请先输入章节名称</strong></div><div class="publish_error publish_error_3" style="display:none"><span></span><strong>章节名称长度不能超过20个字</strong></div>' +
                    	'<div class="clear"></div>' +
                    '</div>' +
                    '<div class="clear"></div>' +
                '</div>' +
                '<!--publish_input_box -->' +

            	'<div class="publish_input_box">' +
                	'<div class="publish_input_name"><span>*</span>章节内容</div>' +
                    '<div class="publish_inputs">' +
						'<div class="plupload_wrapper plupload_scroll">' +
							'<div id="' + id + '_container" class="plupload_container">' +
								'<div class="plupload">' +
									'<div class="plupload_header">' +
										'<div class="plupload_header_content">' +
											'<div class="plupload_header_title">' + _('Select files') + '</div>' +
											'<div class="plupload_header_text">' + _('Add files to the upload queue and click the start button.') + '</div>' +
										'</div>' +
									'</div>' +

									'<div class="plupload_content">' +
										'<div class="plupload_filelist_header">' +
											'<div class="plupload_file_name">' + _('Filename') + '</div>' +
											'<div class="plupload_file_action">&nbsp;</div>' +
											'<div class="plupload_file_status"><span>' + _('Status') + '</span></div>' +
											'<div class="plupload_file_size">' + _('Size') + '</div>' +
											'<div class="plupload_clearer">&nbsp;</div>' +
										'</div>' +

										'<div class="publish_file_img_box"><ul id="' + id + '_filelist" class="plupload_filelist"></ul></div>' +

										'<div class="plupload_filelist_footer">' +
											'<div class="plupload_file_name">' +
												'<div class="plupload_buttons">' +
													'<a href="#" class="plupload_button plupload_add file_up_but" id="' + id + '_browse">' + _('添加文件') + '</a>' +
													'<a href="#" class="plupload_button plupload_start file_up_but">' + _('开始上传') + '</a>' +
												'</div>' +
												'<span class="plupload_upload_status"></span>' +
											'</div>' +
											'<div class="plupload_file_action"></div>' +
											'<div class="plupload_file_status"><span class="plupload_total_status">0%</span></div>' +
											'<div class="plupload_file_size"><span class="plupload_total_file_size">0 b</span></div>' +
											'<div class="plupload_progress">' +
												'<div class="plupload_progress_container">' +
													'<div class="plupload_progress_bar"></div>' +
												'</div>' +
											'</div>' +
											'<div class="plupload_clearer">&nbsp;</div>' +
										'</div>' +
									'</div>' +
								'</div>' +
							'</div>' +
							'<input type="hidden" id="' + id + '_count" name="' + id + '_count" value="0" />' +
						'</div>' +
                        '<p>注:支持上传jpg、jpeg、png、gif格式图片，大小不超过3MB，长宽为1:1效果最好。</p>' +

                    	'<div class="clear"></div>' +
                    '</div>' +
                    '<div class="clear"></div>' +
                '</div>' +
                '<!--publish_input_box -->' +

            '</div>' +
            '<!--publish_section -->')
		);
    }

    $.fn.pluploadQueue = function (settings) {
        if (settings) {
            this.each(function () {
                var uploader, target, id, contents_bak;

                target = $(this);
                id = target.attr('id');

                if (!id) {
                    id = plupload.guid();
                    target.attr('id', id);
                }

                contents_bak = target.html();
                renderUI(id, target);

                settings = $.extend({
                    dragdrop: true,
                    browse_button: id + '_browse',
                    container: id
                }, settings);

                // Enable drag/drop (see PostInit handler as well)
                if (settings.dragdrop) {
                    settings.drop_element = id + '_filelist';
                }

                uploader = new plupload.Uploader(settings);

                uploaders[id] = uploader;

                function handleStatus(file) {
                    var actionClass;

                    if (file.status == plupload.DONE) {
                        if (pluploadSwitch == 1) {
                            actionClass = 'plupload_done p_file';
                        } else {
                            actionClass = 'plupload_done p_file p_file_2';
                        }
                    }

                    if (file.status == plupload.FAILED) {
                        if (pluploadSwitch == 1) {
                            actionClass = 'plupload_failed p_file';
                        } else {
                            actionClass = 'plupload_failed p_file p_file_2';
                        }
                    }

                    if (file.status == plupload.QUEUED) {
                        if (pluploadSwitch == 1) {
                            actionClass = 'plupload_delete p_file';
                        } else {
                            actionClass = 'plupload_delete p_file p_file_2';
                        }
                    }

                    if (file.status == plupload.UPLOADING) {
                        if (pluploadSwitch == 1) {
                            actionClass = 'plupload_uploading p_file';
                        } else {
                            actionClass = 'plupload_uploading p_file p_file_2';
                        }
                    }

                    var icon = $('#' + file.id).attr('class', actionClass).find('a')//.css('display', 'block');
                    if (file.hint) {
                        //icon.attr('title', file.hint);
                    }
                }

                function updateTotalProgress() {
                    $('span.plupload_total_status', target).html(uploader.total.percent + '%');
                    $('div.plupload_progress_bar', target).css('width', uploader.total.percent + '%');
                    $('span.plupload_upload_status', target).html(
						o.sprintf(_('Uploaded %d/%d files'), uploader.total.uploaded, uploader.files.length)
					);
                }

                function updateList() {
                    var sFilesLen = uploader.files.length;
                    var fileList = $('ul.plupload_filelist', target), inputCount = 0, inputHTML;
                    var oFile = uploader.files;
                    for (var i = 0; i < sFilesLen; i++) {
                        (function (i) {
                            file = oFile[i];
                            //fileList.find('.plupload_droptext').remove();
                            if ($('#' + file.id).length <= 0) {
                                inputHTML = '';

                                if (file.status == plupload.DONE) {
                                    if (file.target_name) {
                                        inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_tmpname" value="' + plupload.xmlEncode(file.target_name) + '" />';
                                    }

                                    inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_name" value="' + plupload.xmlEncode(file.name) + '" />';
                                    inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_status" value="' + (file.status == plupload.DONE ? 'done' : 'failed') + '" />';

                                    inputCount++;

                                    $('#' + id + '_count').val(inputCount);
                                }
                                (function (file) {
                                    previewImage(file, function (imgsrc) {
                                        if ($('#' + file.id).length <= 0) {
                                            var sLis = $('<li id="' + file.id + '"><div class="p_img_box"><div class="img"><img src="' + imgsrc + '"/><div class="p_img_conter"></div></div><div class="p_img_edit_box"><div class="p_img_edit_but_1"></div><div class="p_img_edit_but_2" rotate_deg="0"></div> </div> </div><h4>' + file.name + '</h4>' + inputHTML + '</li>');
                                            fileList.append(sLis);
                                            LiPluploadDone();

                                            sLis.find('.p_img_edit_but_1').click(function () {
                                                //{"name":"fdas","order":1,"files":["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg"]}
                                                var oThis = $(this);
                                                var oPQueue = oThis.parents('.queue').attr('id');
                                                oPQueue = oPQueue.substring(5, oPQueue.length);
                                                var oUl = oThis.parents('ul.plupload_filelist');
                                                var oFormInput = $('#chapter_' + oPQueue);
                                                var item = oThis.parents("li");
                                                var sInputVal = oThis.parents(".queue").find("input").eq(0).val();
                                                var oAngleLis = oThis.parents('li').siblings('li');
                                                var sItemId = item.attr("id");
                                                file = uploader.getFile(sItemId);
                                                uploader.removeFile(file);
                                                item.remove();
                                                var oJsons = '{"name":"' + sInputVal + '","order":' + oPQueue + ',"files":[';
                                                for (var i = 0; i < oAngleLis.length; i++) {
                                                    var sImgNmae = $.trim($(oAngleLis[i]).find('h4').text());
                                                    //var sImgAngle = $.trim($(oAngleLis[i]).find('.p_img_edit_but_2').attr('rotate_deg'));
                                                    oJsons += '"' + sImgNmae + '",';
                                                    //oJsons += '"angle":"' + sImgAngle + '"},';
                                                }
                                                oJsons = oJsons.substring(0, oJsons.length - 1);
                                                oJsons += ']}';
                                                oFormInput.val(oJsons);
                                                //var oPQueue = oThis.parents('.queue').index();
                                                //var oUl = oThis.parents('ul.plupload_filelist');
                                                //var oFormInput = $('#CreateForm>input[name=chapters]:eq(' + oPQueue + ')');
                                                //var item = oThis.parents("li");
                                                //item.remove();
                                                //var oImgName = oUl.find('h4');
                                                //var sH4 = '';
                                                //oFormInput.val('');
                                                //for (var hh = 0; hh < oImgName.length; hh++) {
                                                //    sH4 += $(oImgName[hh]).text() + '$';
                                                //}
                                                //oFormInput.val(sH4);
                                                LiPluploadDone();
                                            });
                                        }
                                    });

                                })(file);

                                //handleStatus(file);
                                //$('#' + file.id + '.plupload_delete .p_file_but_5').click(function (e) {
                                //    $('#' + file.id).remove();
                                //    uploader.removeFile(file);

                                //    e.preventDefault();
                                //});

                            }
                        })(i);
                    }
                    LiPluploadDone();

                    //$.each(uploader.files, function(i, file) {
                    //	inputHTML = '';

                    //	if (file.status == plupload.DONE) {
                    //		if (file.target_name) {
                    //			inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_tmpname" value="' + plupload.xmlEncode(file.target_name) + '" />';
                    //		}

                    //		inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_name" value="' + plupload.xmlEncode(file.name) + '" />';
                    //		inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_status" value="' + (file.status == plupload.DONE ? 'done' : 'failed') + '" />';

                    //		inputCount++;

                    //		$('#' + id + '_count').val(inputCount);
                    //	}
                    //	if(pluploadSwitch==1){
                    //		pluploadHtml='<div class="p_file_input"><input type="text" placeholder="标价" /></div><em>学币</em>';
                    //	}
                    //	previewImage(file, function (imgsrc) {
                    //	    var fff = $("#" + file.id).parents(".publish_section").parent().attr("id");
                    //	    var forms = $("#" + fff + " h4");
                    //	    var n = 0;
                    //	    for (var j = 0; j < forms.length; j++) {
                    //	        if ($(forms[j]).text() == file.name) {
                    //	            n++;
                    //	        }
                    //	    }
                    //	    if (n == 0) {
                    //	        fileList.append(
                    //	            '<li id="' + file.id + '"><div class="p_img_box"><div class="img"><img src="' + imgsrc + '"/><div class="p_img_conter"></div></div><div class="p_img_edit_box"><div class="p_img_edit_but_1"></div><div class="p_img_edit_but_2" rotate_deg="0"></div> </div> </div><h4>' + file.name + '</h4>' + inputHTML + '</li>'
                    //	        );
                    //	    }
                    //	}
                    //    );











                    //	//fileList.append(
                    //	//	'<li id="' + file.id + '">' + pluploadHtml +
                    //	//		'<div class="plupload_file_name"><span>' + file.name + '</span></div>' +
                    //	//		'<span class="file_plan"><span class="plupload_file_status" style="width:' + file.percent + '%;"></span></span>'+
                    //	//		'<div class="plupload_file_size">' + plupload.formatSize(file.size) + '</div>'+
                    //	//		'<div class="p_file_but_box plupload_file_action">' +
                    //	//			'<a href="javascript:;" class="p_file_but_3" title="下移"></a>'+
                    //	//			'<a href="javascript:;" class="p_file_but_4" title="上移"></a>'+
                    //	//			'<a href="javascript:;" class="p_file_but_5" title="删除" val=""  onclick="removeli(this)"></a>' +
                    //	//		'</div>'+
                    //	//		inputHTML +
                    //	//	'</li>'
                    //	//);

                    //	handleStatus(file);

                    //	$('#' + file.id + '.plupload_delete .p_file_but_5').click(function(e) {
                    //		$('#' + file.id).remove();
                    //		uploader.removeFile(file);

                    //		e.preventDefault();
                    //	});
                    //});

                    $('span.plupload_total_file_size', target).html(plupload.formatSize(uploader.total.size));

                    if (uploader.total.queued === 0) {
                        $('span.plupload_add_text', target).html(_('Add Files'));
                    } else {
                        $('span.plupload_add_text', target).html(o.sprintf(_('%d files queued'), uploader.total.queued));
                    }

                    $('a.plupload_start', target).toggleClass('plupload_disabled', uploader.files.length == (uploader.total.uploaded + uploader.total.failed));

                    // Scroll to end of file list
                    fileList[0].scrollTop = fileList[0].scrollHeight;

                    updateTotalProgress();

                    // Re-add drag message if there is no files

                    //if (!uploader.files.length && uploader.features.dragdrop && uploader.settings.dragdrop) {
                    //    $('#' + id + '_filelist').append('<li class="plupload_droptext">' + _("上传文件放在这里。") + '</li>');
                    //}


                }

                function destroy() {
                    delete uploaders[id];
                    uploader.destroy();
                    target.html(contents_bak);
                    uploader = target = contents_bak = null;
                }

                uploader.bind("UploadFile", function (up, file) {
                    $('#' + file.id).addClass('plupload_current_file');
                });

                uploader.bind('Init', function (up, res) {
                    // Enable rename support
                    if (!settings.unique_names && settings.rename) {
                        target.on('click', '#' + id + '_filelist div.plupload_file_name span', function (e) {
                            var targetSpan = $(e.target), file, parts, name, ext = "";

                            // Get file name and split out name and extension
                            file = up.getFile(targetSpan.parents('li')[0].id);
                            name = file.name;
                            parts = /^(.+)(\.[^.]+)$/.exec(name);
                            if (parts) {
                                name = parts[1];
                                ext = parts[2];
                            }

                            // Display input element
                            targetSpan.hide().after('<input type="text" />');
                            targetSpan.next().val(name).focus().blur(function () {
                                targetSpan.show().next().remove();
                            }).keydown(function (e) {
                                var targetInput = $(this);

                                if (e.keyCode == 13) {
                                    e.preventDefault();

                                    // Rename file and glue extension back on
                                    file.name = targetInput.val() + ext;
                                    targetSpan.html(file.name);
                                    targetInput.blur();
                                }
                            });
                        });
                    }

                    //$('#' + id + '_container').attr('title', 'Using runtime: ' + res.runtime);

                    $('a.plupload_start', target).click(function (e) {
                        if (!$(this).hasClass('plupload_disabled')) {
                            uploader.start();
                        }

                        e.preventDefault();
                    });

                    $('a.plupload_stop', target).click(function (e) {
                        e.preventDefault();
                        uploader.stop();
                    });

                    $('a.plupload_start', target).addClass('plupload_disabled');
                });

                uploader.bind("Error", function (up, err) {
                    var file = err.file, message;

                    if (file) {
                        message = err.message;

                        if (err.details) {
                            message += " (" + err.details + ")";
                        }

                        if (err.code == plupload.FILE_SIZE_ERROR) {
                            alert(_("Error: File too large:") + " " + file.name);
                        }

                        if (err.code == plupload.FILE_EXTENSION_ERROR) {
                            alert(_("Error: Invalid file extension:") + " " + file.name);
                        }

                        file.hint = message;
                        $('#' + file.id).attr('class', 'plupload_failed').find('a').css('display', 'block');//.attr('title', message);
                    }

                    if (err.code === plupload.INIT_ERROR) {
                        setTimeout(function () {
                            destroy();
                        }, 1);
                    }
                });

                uploader.bind("PostInit", function (up) {
                    // features are populated only after input components are fully instantiated
                    if (up.settings.dragdrop && up.features.dragdrop) {
                        //$('#' + id + '_filelist').append('<li class="plupload_droptext">' + _("把上传文件拖到这里。") + '</li>');
                    }
                });

                uploader.init();

                uploader.bind('StateChanged', function () {
                    if (uploader.state === plupload.STARTED) {
                        //$('li.plupload_delete a,div.plupload_buttons', target).hide();
                        //uploader.disableBrowse(true);

                        //$('span.plupload_upload_status,div.plupload_progress,a.plupload_stop', target).css('display', 'block');
                        $('span.plupload_upload_status', target).html('Uploaded ' + uploader.total.uploaded + '/' + uploader.files.length + ' files');

                        if (settings.multiple_queues) {
                            $('span.plupload_total_status,span.plupload_total_file_size', target).show();
                        }
                    } else {
                        //updateList();
                        $('a.plupload_stop,div.plupload_progress', target).hide();
                        $('a.plupload_delete', target).css('display', 'block');

                        if (settings.multiple_queues && uploader.total.uploaded + uploader.total.failed == uploader.files.length) {
                            $(".plupload_buttons,.plupload_upload_status", target).css("display", "inline");
                            uploader.disableBrowse(false);

                            $(".plupload_start", target).addClass("plupload_disabled");
                            $('span.plupload_total_status,span.plupload_total_file_size', target).hide();
                        }
                    }
                });

                uploader.bind('FilesAdded', updateList);

                uploader.bind('FilesRemoved', function () {
                    // since the whole file list is redrawn for every change in the queue
                    // we need to scroll back to the file removal point to avoid annoying
                    // scrolling to the bottom bug (see #926)
                    var scrollTop = $('#' + id + '_filelist').scrollTop();
                    updateList();
                    $('#' + id + '_filelist').scrollTop(scrollTop);
                });

                uploader.bind('FileUploaded', function (up, file) {
                    handleStatus(file);
                });

                uploader.bind("UploadProgress", function (up, file) {
                    // Set file specific progress
                    $('#' + file.id + ' div.plupload_file_status', target).html(file.percent + '%');

                    handleStatus(file);
                    updateTotalProgress();
                });

                // Call setup function
                if (settings.setup) {
                    settings.setup(uploader);
                }
            });

            return this;
        } else {
            // Get uploader instance for specified element
            return uploaders[$(this[0]).attr('id')];
        }
    };
})(jQuery, mOxie);
//plupload中为我们提供了mOxie对象
//有关mOxie的介绍和说明请看：https://github.com/moxiecode/moxie/wiki/API
//如果你不想了解那么多的话，那就照抄本示例的代码来得到预览的图片吧
function previewImage(file, callback) {//file为plupload事件监听函数参数中的file对象,callback为预览图片准备完成的回调函数
    if (!file || !/image\//.test(file.type)) return; //确保文件是图片
    if (file.type == 'image/gif') {//gif使用FileReader进行预览,因为mOxie.Image只支持jpg和png
        var fr = new mOxie.FileReader();
        fr.onload = function () {
            callback(fr.result);
            fr.destroy();
            fr = null;
        }
        fr.readAsDataURL(file.getSource());
    } else {
        var preloader = new mOxie.Image();
        preloader.onload = function () {
            preloader.downsize(300, 300);//先压缩一下要预览的图片,宽300，高300
            var imgsrc = preloader.type == 'image/jpeg' ? preloader.getAsDataURL('image/jpeg', 80) : preloader.getAsDataURL(); //得到图片src,实质为一个base64编码的数据
            callback && callback(imgsrc); //callback传入的参数为预览图片的url
            preloader.destroy();
            preloader = null;
        };
        preloader.load(file.getSource());
    }
}